import header from './commonHeader.js';

export default function (data) {
    let datas = [{
        flowDefName: '工作',
        taskAuthList: [{'权限': true}, {'查看': false}, {'权限': true}, {'查看': false}, {'权限': true}, {'查看': false}, {'权限': true}, {'查看': false}, {'权限': true}, {'查看': false}, {'权限': true}, {'查看': false},]
    }, {flowDefName: '工作', taskAuthList: [{'权限': true}, {'查看': false}]}];
    let style = `
                <style>
                  .authorityListWrap{
                        width: 9.2rem;
                        margin: 0.267rem auto;
                        font-size: 0.4rem;
                        overflow: hidden;
                  }
                  .taskAuthListWrap{
                        width: 8rem;
                        float: left;
                        line-height: 0.8rem;     
                  }
                  .flowDefName{
                        width: 1.2rem;
                        float: left;
                        text-align: center;
                        height: 100%;
                        line-height: 0.8rem;     
                  }
                  .taskAuthList{
                    display: inline-block;
                    margin-right: 0.133rem;
                    height: 0.8rem;
                    line-height: 0.8rem;
                  }
                  .taskAuthListSpan{
                    display: inline-block;
                    width: 0.233rem;
                    height: 0.233rem;
                    border: 0.013rem solid #999;
                    border-radius: 0.333rem;
                    margin-right: 0.067rem;
                  }
                  .authListSubmit{
                     display: block;
                     width: 9.2rem;
                     margin: 0 auto;
                     margin-top: 0.4rem;
                     font-size: 0.4rem;  
                     text-align: center;
                     height: 0.8rem;
                     line-height: 0.8rem;
                     background: #008be6;
                     color: white;
                     border: none;
                     border-radius: 0.2rem;
                  }
                </style>
    `;
    let html = ``;
    datas.forEach((item) => {
        let taskAuthListString = ``;
        item.taskAuthList.forEach((item) => {
            taskAuthListString += ` <span class="taskAuthList"><input type="checkbox"><span>${Object.keys(item)[0]}</span></span>`
        });
        html += `<div class="authorityListWrap"><span class="flowDefName"><span>${item.flowDefName}<span>:</span></span></span><div class="taskAuthListWrap">${taskAuthListString}</div></div>`
    })
    let headerString = header({'title': '权限管理', 'leftBtn': '取消', 'leftPath': '2222'})
    let submitString = `<button class="authListSubmit">提交</button>`
    html = headerString + html + submitString;
    window.nbasics.differAction(() => {
        document.querySelector('.authListSubmit').onclick = function () {
            console.log(1)
        }
    });
    return (`<div >${style}${html}</div>`);
}